<template>
	<view>
		<uv-navbar :title="title" bg-color="rgba(255,255,255,1)" :placeholder='true' leftIconSize="20px"
			leftIconColor="#313C56" :autoBack='true' titleStyle="font-size: 16px;font-weight: 500;color: #313c56;">
		</uv-navbar>
		<scroll-view :scroll-y="true" :style="{height: $uv.addUnit(scrollHeight)}">
			<view class="flex-column" style="margin-left: 16px; margin-right: 16px;">
				<publish-item title="公司名称" :value="name" requisite @inputEnd=" val => name = val "></publish-item>
				<publish-item title="公司简介" :value="info" requisite touchDisabled @touchTap="intoInfo"></publish-item>
				<view class="flex-row flex-items-center font-14 font-weight-regular"
					style="color: #313C56; margin-top: 8px;">
					<image src="/static/xinghao.png" style="width: 8px; height: 8px; margin-right: 4px;"></image>
					<text>营业执照</text>
				</view>
				<view style="margin-top: 15px;">
					<uv-upload :fileList="fileList1" name="file1" :maxCount="1" width="80" height="80"
						@afterRead='choosedImages' @delete="deleteImages">
						<view class="flex-row-center"
							style="background-color: white; width: 80px; height: 80px; border: 1px solid #EFF0F4;">
							<image src="/static/add.png" style="width: 28px;height: 28px;"></image>
						</view>
					</uv-upload>
				</view>
				<view class="flex-row flex-items-center font-14 font-weight-regular"
					style="color: #313C56; margin-top: 8px;">
					<image src="/static/xinghao.png" style="width: 8px; height: 8px; margin-right: 4px;"></image>
					<text>图片简介</text>
				</view>
				<view style="margin-top: 15px;">
					<uv-upload :fileList="fileList2" name="file2" :maxCount="3" width="80" height="80"
						@afterRead='choosedImages' @delete="deleteImages">
						<view class="flex-row-center"
							style="background-color: white; width: 80px; height: 80px; border: 1px solid #EFF0F4;">
							<image src="/static/add.png" style="width: 28px;height: 28px;"></image>
						</view>
					</uv-upload>
				</view>
			</view>
		</scroll-view>
		<view class="font-16 font-weight-regular flex-row-center"
			style="margin-top: 12px; margin-left: 36px; margin-right: 36px; height: 44px; border-radius: 22px; background-color: #EB7520; color: white;"
			@click="commit">
			提交
		</view>
		<toast ref="toast"></toast>
	</view>
</template>

<script>
	import publishItem from "@/components/publish-item/publish-item.vue"
	import {
		editTeamApi,
		getTeam
	} from "@/api/index.js"
	export default {
		components: {
			publishItem
		},
		data() {
			return {
				name: '',
				info: '',
				fileList1: [],
				fileList2: [],
				id: '',
				title: '创建公司'
			}
		},
		computed: {
			statusBarHeight() {
				const sys = uni.$uv.sys()
				return sys.statusBarHeight
			},
			navbarHeight() {
				return this.statusBarHeight + 44
			},
			screenWidth() {
				const sys = uni.$uv.sys()
				return sys.windowWidth
			},
			pageHeight() {
				const sys = uni.$uv.sys()
				return sys.windowHeight - this.navbarHeight
			},
			scrollHeight() {
				return this.pageHeight - this.toolbarHeight - 10
			},
			toolbarHeight() {
				const sys = uni.$uv.sys()
				return sys.safeAreaInsets.bottom + 68
			}
		},
		onLoad(info) {
			if (info.id) {
				this.title = '编辑公司'
				this.id = info.id
				this.getDetailData()
			}
		},
		methods: {
			commit() {
				let msg = ''
				if (this.name.length == 0) {
					msg = '请输入公司名称'
				}
				if (this.info.length == 0) {
					msg = '请输入公司简介'
				}
				if (this.fileList1.length == 0) {
					msg = '请上传营业执照'
				}
				if (this.fileList2.length == 0) {
					msg = '请上传图片简介'
				}
				if (msg.length != 0) {
					this.$refs.toast.show({
						msg: msg
					})
					return
				}

				let picsUrl = []
				for (var i = 0; i < this.fileList2.length; i++) {
					picsUrl.push(this.fileList2[i].url)
				}

				let params = {
					type: '1',
					name: this.name,
					intro: this.info,
					picsUrl: picsUrl,
					license: this.fileList1[0].url
				}
				if (this.id) {
					params.teamId = this.id
				}
				editTeamApi(params).then((data) => {
					this.$refs.toast.show({
						msg: this.id.length == 0 ? '创建成功' : '编辑成功',
						isSuccees: true,
						complete: () => {
							setTimeout(() => {
								this.getOpenerEventChannel().emit('update')
								uni.navigateBack()
							}, 2000)
						}
					})
				}).catch((err) => {})
			},
			getDetailData() {
				let params = {
					id: this.id
				}
				getTeam(params).then((data) => {
					this.name = data.name
					this.info = data.intro
					this.fileList1.push({
						url: data.license
					})
					let fileList2 = []
					for (var i = 0; i < data.introPics.length; i++) {
						fileList2.push({
							url: data.introPics[i]
						})
						if (fileList2.length == 3) {
							break
						}
					}
					this.fileList2 = fileList2
				}).catch((e) => {})
			},
			intoInfo() {
				uni.navigateTo({
					url: `/pages/describe-edit/describe-edit?title=公司简介&value=${this.info}`,
					events: {
						describeEdit: data => {
							this.info = data
						}
					}
				})
			},
			/**
			 * 删除图片
			 */
			deleteImages(event) {
				if (event.name == 'file1') {
					this.fileList1.splice(event.index, 1)
				} else {
					console.log(event)
					this.fileList2.splice(event.index, 1)
				}

			},
			/**
			 * 选择图片
			 */
			async choosedImages(event) {
				uni.showLoading({
					title: '正在上传...',
					mask:true
					
				})
				const a = await this.upload(event.file.url)
				setTimeout(function() {
					uni.hideLoading()
				}, 50)
				if (event.name == 'file1') {
					this.fileList1.push({
						url: a
					})
				} else {
					this.fileList2.push({
						url: a
					})
				}

			},
			/**
			 * 上传文件
			 */
			upload(url) {
				return new Promise((resolve, reject) => {
					uni.$uv.http.upload('api/front/upload', {
						filePath: url,
						name: 'file',
						validateStatus: (statusCode) => {
							return statusCode == 200
						}
					}).then(res => {
						// 返回的res.data 已经进行JSON.parse
						console.log(res)
						resolve(res)
					}).catch(err => {
						console.log(err)
						reject(err)
					})
				})
			},
		}
	}
</script>

<style lang="scss">
	page {
		background-color: white;
	}
</style>